<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>新美DSP系统</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<!--框架核心CSS库-->
		<link rel="stylesheet" href="/static/backend/plugins/layui/css/layui.css">
		<link rel="stylesheet" href="/static/backend/css/font-awesome.min.css">
		<link rel="stylesheet" href="/static/backend/css/global.css">
		<link rel="stylesheet" href="/static/backend/css/style.css">
		<script src="/static/backend/js/jquery/2.0.1/jquery.min.js"></script>
		
		
	</head>
	
	<body>
		<div class="layui-layout layui-layout-admin">
			
			<!-- 水平导航 -->
			<div class="layui-header header">
	<div class="layui-main">
		<a class="header-logo" href="/">
		  <b>新美控股</b> | DSP媒体服务
		</a>
		
		<!-- 消息提示 -->
		<div id="messages" class="header-menu">
			<div class="ssp-bulletin-package">
				<div class="message-num">0</div>
			</div>
			
		</div>
		<!-- 消息提示 end -->
		
		<!-- 用户信息 -->
		<div id="accounts" class="header-menu header-drop-down-menu">
			<div id="user-name" class="title" title="">
				<i class="ui-icon-user"></i><span>新美控股</span><i class="ui-icon-caret-down"></i>
			</div>
			<ul id="account-detail">
				<li>
					<a href="/passport/account"><i class="ui-icon-cog"></i>账号管理</a>
				</li>
				<li>
					<a href="/passport/logout"><i class="ui-icon-power-off"></i>退出</a>
				</li>
			</ul>
		</div>
		
		<!-- 用户信息 end -->
		
		
	</div>
</div>
			<!-- 水平导航 end-->
			
			<!-- 侧边导航 -->
			<div class="layui-side layui-bg-gray">
    <div class="layui-side-scroll">
      
		<ul class="layui-nav layui-nav-tree" lay-filter="navTree">
			<li class="layui-nav-item sidebar-menu-home">
				<a class="sidebar-menu-title" href="/main/index" data-pjax>
					<i class="sidebar-menu-icon"></i>
					<span class="sidebar-menu-text">首页</span>
				</a>
			</li>
			<li class="layui-nav-item sidebar-menu-delivery">
				<a class="sidebar-menu-title" href="javascript:;">
					<i class="sidebar-menu-icon"></i> 
					<span class="sidebar-menu-text">投放管理</span>
					<span class="layui-nav-more"></span>
				</a>
				<dl class="layui-nav-child">
				  <dd class="">
					<a href="/AdOrder/index" data-pjax>订单管理</a>
				  </dd>
				  <dd class="">
					<a href="/AdDelivery/index" data-pjax>广告投放管理</a>
				  </dd>
				  <dd class="">
					<a href="/ad/index" data-pjax>物料管理</a>
				  </dd>
					<dd class="">
						<a href="/adGame/index" data-pjax>游戏管理</a>
					</dd>
				</dl>
			</li>
			
			<li class="layui-nav-item sidebar-menu-resource">
				<a class="sidebar-menu-title" href="javascript:;">
					<i class="sidebar-menu-icon"></i>
					<span class="sidebar-menu-text">资源管理</span>
					<span class="layui-nav-more"></span>
				</a>
				<dl class="layui-nav-child">
				  <dd class="">
					<a  href="/code/index" data-pjax>代码位管理</a>
				  </dd>
				</dl>
			</li>
			<li class="layui-nav-item sidebar-menu-report">
				<a class="sidebar-menu-title" href="javascript:;">
					<i class="sidebar-menu-icon"></i>
					<span class="sidebar-menu-text">财务管理</span>
					<span class="layui-nav-more"></span>
				</a>
				<dl class="layui-nav-child">
					<dd class="">
						<a  href="/finance/index" data-pjax>财务报告</a>
					</dd>
				</dl>
			</li>
			
			<li class="layui-nav-item sidebar-menu-report">
				<a class="sidebar-menu-title" href="javascript:;">
					<i class="sidebar-menu-icon"></i>
					<span class="sidebar-menu-text">报告</span>
					<span class="layui-nav-more"></span>
				</a>
				<dl class="layui-nav-child">
				  <dd class="">
					<a  href="/report/total" data-pjax>整体报告</a>
				  </dd>
				  <dd class="">
					<a  href="/report/adPosition" data-pjax>资源报告</a>
				  </dd>
				  <dd class="">
					<a  href="/report/delivery" data-pjax>投放报告</a>
				  </dd>
				  <dd class="">
				  	<a  href="/report/game" data-pjax>游戏报告</a>
				  </dd>
				</dl>
			</li>

			<span class="layui-nav-bar" style="top: 22.5px; height: 0px; opacity: 0;"></span>
		</ul>

    </div>
  </div>
			<!-- 侧边导航 end-->
		

			<!-- 右侧主体内容 -->
			<div class="layui-body">
				<div class="layui-content dsp-content" id="pjaxContent">
					
	
	<block name="body">
		<link rel="stylesheet" href="/static/backend/css/report.css">
		<link rel="stylesheet"href="/static/backend/plugins/layui/css/modules/layer/default/layer.css"  media="all">
		<script src="/static/backend/plugins/echarts/echarts.js"></script>
		<div class="page-crumb">
			<div class="ui-ctrl ui-crumb"><span class="ui-crumb-node ui-crumb-node-first ui-crumb-node-last">整体报告</span></div>
			<div class="layui-form-item">
				<div class="layui-inline">
					<input class="layui-input" name="begin" placeholder="请选择开始时间" value="<?php echo ($data["begin"]); ?>" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD'})">
				</div>至
				<div class="layui-inline">
					<input class="layui-input" name="end" placeholder="请选择结束时间" value="<?php echo ($data["end"]); ?>" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD'})">
				</div>
				<button class="layui-btn layui-btn-min" lay-submit="" lay-filter="submit" id="ssss">　　确定　　</button>
			</div>


		</div>

		<div class="layui-main">
			<div class="report-view">
				<div class="report-general">
					<ul class="general-detail">
						<li class="general-detail-item general-detail-item-view">
							<p class="general-detail-item-base">
								<span class="general-detail-item-data" id="view"></span>
							</p>
							<p class="general-detail-item-name">展现量</p>
						</li>

						<li class="general-detail-item general-detail-item-click">
							<p class="general-detail-item-base">
								<span class="general-detail-item-data" id="click"></span>
							</p>
							<p class="general-detail-item-name">点击量</p>
						</li>

						<li class="general-detail-item general-detail-item-click-ratio">
							<p class="general-detail-item-base">
								<span class="general-detail-item-data" id="click_rate_sum"></span>
							</p>
							<p class="general-detail-item-name">点击率</p>
						</li>

					</ul>
					<div class="ui-ctrl ui-crumb"><span class="ui-crumb-node ui-crumb-node-first ui-crumb-node-last">趋势图</span>
					</div>
				</div>
			</div>
		</div>

		<div id="main" style="width: 1673px;height:300px;">

		</div>
		<table class="layui-table list-content-table" lay-skin="nob">
			<colgroup>
				<col width="20">
				<col width="200">
				<col width="150">
				<col width="200">
				<col width="200">
				<col width="150">
				<col width="150">

			</colgroup>
			<thead class="list-table-head">
			<tr>
				<th class="ui-table-hcell">
					<div class="ui-table-hcell-text ui-table-hcell-text-first">

					</div>
				</th>
				<th class="ui-table-hcell">
					<div class="ui-table-hcell-text">时间</div>
				</th>
				<th class="ui-table-hcell">
					<div class="ui-table-hcell-text">数据来源</div>
				</th>

				<th class="ui-table-hcell">
					<div class="ui-table-hcell-text">展现量</div>
				</th>
				<th class="ui-table-hcell">
					<div class="ui-table-hcell-text">点击量</div>
				</th>
				<th class="ui-table-hcell">
					<div class="ui-table-hcell-text">点击率</div>
				</th>
			</tr>
			</thead>

			<tbody class="list-table-body" id="each">

			</tbody>
		</table>

		<script>
            $(document).ready(function(){

                $.ajax({
                    type:"get",
                    url:'/Elastic/total_Statistics',
                    dataType:"json",
                    success: function(data){

                        if(data.status == '1') {
                            $("#view").text(data.data.total_view_sum);
                            $("#click").text(data.data.total_click_sum);
                            $("#click_rate_sum").text(data.data.total_click_rate_sum +='%' );

                            var str = '';
                            $.each(data.data.total_list,function(index,item){

                                    str += "<tr><td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>  </div></td>";
                                    str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.time + "</div></td>";
                                    str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>dsp</div></td>";
                                    str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.total_view + "</div></td>";
                                    str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.total_click + "</div></td>";
                                    str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.total_click_rate + "%</div></td></tr>";



                            });
                            $('#each').append(str);

                            showEchart(data.data);
                        } else {
                            console.log('没接收到返回数据');
                        }
                        return false;
                    }
                });
            });
            $("#ssss").click(function () {
                var begin =$(" input[ name='begin' ] ").val();
                var  end  =$(" input[ name='end' ] ").val();

                $.ajax({
                    type:"get",
                    url:'/Elastic/total_Statistics',
                    dataType:"json",
                    data:{'begin':begin,'end':end},
                    success: function(data){

                        if(data.status == '1') {

                            $("#view").text(data.data.total_view_sum);
                            $("#click").text(data.data.total_click_sum);
                            $("#click_rate_sum").text(data.data.total_click_rate_sum +='%');

                            var str = '';

                            $.each(data.data.total_list,function(index,item){
                                str += "<tr><td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>  </div></td>";
                                str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.time + "</div></td>";
                                str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>dsp</div></td>";
                                str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.total_view + "</div></td>";
                                str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.total_click + "</div></td>";
                                str += "<td class='ui-table-cell'>"+"<div class='ui-table-cell-text'>" + item.total_click_rate + "%</div></td></tr>";

                            });

                            $('#each').empty();
                            $('#each').append(str);

                            showEchart(data.data);
                        } else {
                            console.log('没接收到返回数据');
                        }
                        return false;
                    }
                });
            });

            function showEchart(data) {

                var myChart = echarts.init(document.getElementById('main'));

                option = {

                    tooltip : {

                        trigger: 'axis'

                    },

                    legend: {

                        data:['展现量','点击量','点击率(%)']


                    },

                    toolbox: {

                        show : true,

                        feature : {

                            mark : {show: true},

                            dataView : {show: true, readOnly: false},

                            magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},

                            restore : {show: true},

                            saveAsImage : {show: true}

                        }

                    },

                    calculable : true,

                    xAxis : [

                        {

                            type : 'category',

                            boundaryGap : false,

                            data:data.time

                        }

                    ],

                    yAxis : [

                        {

                            type : 'value',
                            splitLine:{
                                show:false
                            }

                        }

                    ],

                    series : [

                        {

                            name:'展现量',

                            type:'line',

                            smooth:true,

                            itemStyle: {
                                normal: {
                                    color: '#40E0D0',
                                    borderColor: 'rgba(64,224,208,0.27)',
                                    borderWidth: 12

                                }
                            },
                            areaStyle: {
                                normal: {
                                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: 'rgba(64,224,208, 0.3)'
                                    }, {
                                        offset: 0.8,
                                        color: 'rgba(64,224,208, 0.3)'
                                    }], false),
                                    shadowColor: 'rgba(0, 0, 0, 0.1)',
                                    shadowBlur: 10
                                }
                            },

                            data:data.total_view

                        },

                        {

                            name:'点击量',

                            type:'line',

                            smooth:true,

                            itemStyle: {
                                normal: {
                                    color: '#EE82EE',
                                    borderColor: 'rgba(238,130,238,0.27)',
                                    borderWidth: 12

                                }
                            },
                            areaStyle: {
                                normal: {
                                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: 'rgba(238, 130, 238, 0.3)'
                                    }, {
                                        offset: 0.8,
                                        color: 'rgba(238, 130, 238, 0.3)'
                                    }], false),
                                    shadowColor: 'rgba(238, 130, 238, 0.1)',
                                    shadowBlur: 10
                                }
                            },


                            data:data.total_click

                        },
                        {

                            name:'点击率(%)',

                            type:'line',

                            smooth:true,

                            itemStyle: {
                                normal: {
                                    color: '#FFD770',
                                    borderColor: 'rgba(255,215,0,0.27)',
                                    borderWidth: 12

                                }
                            },
                            areaStyle: {
                                normal: {
                                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: 'rgba(255,215,0, 0.3)'
                                    }, {
                                        offset: 0.8,
                                        color: 'rgba(255,215,0, 0.3)'
                                    }], false),
                                    shadowColor: 'rgba(255,215,0, 0.1)',
                                    shadowBlur: 10
                                }
                            },


                            data:data.total_click_rate

                        }

                    ]

                };
                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);
            }
		</script>
	
				</div>
				<div class="loading-model">
					<div class="spinner">
					  <div class="bounce1"></div>
					  <div class="bounce2"></div>
					  <div class="bounce3"></div>
					</div>
				</div>
			</div>

		</div>
		
		
		<!--框架核心JS库-->
		<script src="/static/backend/plugins/layui/layui.js"></script>
		<script src="/static/backend/js/jquery.pjax.min.js"></script>
		<script src="/static/backend/js/underscore-min.js"></script>
		<script src="/static/backend/js/global.js"></script>
		
	</body>
	
</html>